<template>
	<view>
		<!-- 个人信息 -->
		<view class="mine-img-box">
			<image class="mine-img" src="../../static/mm01.webp"></image>
			<view class="mine-msg">
				{{user.name}}
			</view>
		</view>
		<!-- 页面群 -->
		<view class="page-list-mod">
			<navigator class="page-item" v-for="item in pageList1" :url="item.url" open-type="navigate">
				<image class="page-img" :src="item.image" mode=""></image>
				<view class="page-msg">{{item.msg}}</view>
				<!-- <uni-icons class='page-icon' size="26" type="info" name='info'></uni-icons> -->
			</navigator>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: {
					name: 'xx1',
				},
				pageList1: [{
					image: '../../static/mm01.jpg',
					msg: '订单列表',
					url: '/pages/setting/setting',
				},{
					image: '../../static/mm02.jpg',
					msg: '设置',
					url: '/pages/setting/setting',
				}]
			}
		},
		methods: {
			
		}
	}
</script>

<style>
/* 个人信息 */
.mine-img-box{ display: flex; padding: 0 20rpx;}
.mine-img-box .mine-img{ width: 100rpx; height: 100rpx;}
.mine-img-box .mine-msg{ flex: 1; padding-left: 20px; line-height: 100rpx;}
/* 页面群 */
.page-list-mod .page-item{ position: relative; display: flex; line-height: 100rpx; padding: 8rpx 20rpx;}
.page-list-mod .page-item::after{ content: ''; position: absolute; left: 140rpx; width: 590rpx; bottom: 0; border-bottom: 1px solid #DDD;}
.page-list-mod .page-img{ width: 100rpx; height: 100rpx; border-radius: 50%;}
.page-list-mod .page-msg{ flex: 1; padding-left: 20rpx;}
.page-list-mod .page-icon{ width: 80px;}
</style>
